<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>增加用户</title>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <link rel="stylesheet" href="../../../component/elementUI/index.css" />
    <link rel="stylesheet" href="../../../style/index.css" />
    <link rel="stylesheet" href="../../../component/pear/css/pear.css" />
  </head>

  <body>
    <div id="app" class="minWidth">
      <el-form
        :model="form"
        :rules="rules"
        ref="contract"
        inline-message="true"
        style="width: 100%"
      >
        <div class="table_titel">
          <div class="titel">增加菜单</div>
        </div>
        <el-descriptions :column="1" border size="small">
          <el-descriptions-item label="菜单名称">
            <el-form-item prop="Model_Name">
              <el-input
                v-model.trim="form.Model_Name"
                placeholder="请输入菜单名称"
              ></el-input>
            </el-form-item>
          </el-descriptions-item>
          <el-descriptions-item label="菜单等级">
            <el-form-item prop="Level">
              <el-select
                style="width: 100%"
                placeholder="请选择菜单等级"
                filterable
                v-model.trim="form.Level"
                @change="getMenu($event)"
              >
                <el-option
                  v-for="(item,index) in Level"
                  :key="index"
                  :label="item.label"
                  :value="item.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-descriptions-item>
          <el-descriptions-item label="父级菜单">
            <el-form-item prop="Parent_Number">
              <el-select
                style="width: 100%"
                :disabled="isParent"
                placeholder="请选择父级菜单"
                clearable
                filterable
                v-model.trim="form.Parent_Number"
              >
                <el-option
                  v-for="item in Parent.filter(i=>i.Row_Status!='1')"
                  :key="item.Model_Number"
                  :label="item.Model_Name"
                  :value="item.Model_Number"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-descriptions-item>
          <el-descriptions-item label="是否有子集">
            <el-form-item prop="children">
              <el-radio-group v-model="children" @change="getUrl($event)">
                <el-radio label="是" value="1"></el-radio>
                <el-radio label="否" value="0"></el-radio>
              </el-radio-group>
            </el-form-item>
          </el-descriptions-item>
          <el-descriptions-item label="菜单路由">
            <el-form-item prop="Url">
              <el-input
                :disabled="isUrl"
                v-model.trim="form.Url"
                placeholder="请输入菜单路由"
              ></el-input>
            </el-form-item>
          </el-descriptions-item>
          <el-descriptions-item label="菜单图标">
            <el-form-item prop="Icon">
              <el-select
                placeholder="请选择菜单图标"
                clearable
                filterable
                v-model.trim="form.Icon"
              >
                <el-option
                  v-for="(item,index) in Icon"
                  :key="index"
                  :label="item"
                  :value="'layui-icon '+item"
                >
                  <i class="layui-icon" :class="item"></i>
                  <i>{{item}}</i>
                </el-option>
              </el-select>
              <span style="color: red">(只一级菜单生效)</span>
            </el-form-item>
          </el-descriptions-item>
          <!-- <el-descriptions-item label="菜单配置权">
          <el-form-item prop="role">
            <el-select placeholder="请选择菜单权限" filterable v-model.trim="form.Order">
              <el-option v-for="(item,index) in Role" :key="item" :label="item.label" :value="item.value"></el-option>
            </el-select>
          </el-form-item>
        </el-descriptions-item> -->
        </el-descriptions>
        <!-- <div class="table_titel">
        <div class="titel">页面信息</div>
        <div class="operation">
          <el-button type="primary" size="small" @click="add_system_model_page">新增</el-button>
          <el-button type="danger" size="small" @click="remove_system_model_page">删除</el-button>
        </div>
      </div>
      <el-descriptions :column="2" border size="small" v-for="(item,index) in form.Children.system_model_page" :key="index">
        <el-descriptions-item :label="index+1+'.页面备注'" >
          <el-form-item :prop="'Children.system_model_page.'+index+'.Page_Name'"
            :rules="{required: true, message: '页面备注不能为空', trigger: 'blur' }">
            <el-input v-model.trim="item.Page_Name" placeholder="请输入页面备注"></el-input>
          </el-form-item>
        </el-descriptions-item> 
        <el-descriptions-item label="页面文件名称" >
          <el-form-item :prop="'Children.system_model_page.'+index+'.File_Name'"
            :rules="{required: true, message: '标识不能为空', trigger: 'blur' }">
            <el-input v-model.trim="item.File_Name" placeholder="请输入页面文件名称"></el-input>
          </el-form-item>
        </el-descriptions-item> 
      </el-descriptions> -->
        <div class="table_titel">
          <div class="titel">所属系统</div>
          <div class="operation">
            <el-button
              type="primary"
              size="small"
              @click="add_system_model_list_detail"
              >新增</el-button
            >
            <el-button
              type="danger"
              size="small"
              @click="remove_system_model_list_detail"
              >删除</el-button
            >
          </div>
        </div>
        <el-descriptions
          :column="1"
          border
          size="small"
          v-for="(item,index) in form.Children.system_model_list_detail"
          :key="index"
        >
          <el-descriptions-item :label="index+1+'.所属系统'">
            <el-form-item
              :prop="'Children.system_model_list_detail.'+index+'.System_SerialNumber'"
              :rules="{required: true, message: '所属系统不能为空', trigger: 'change' }"
            >
              <el-select
                style="width: 100%"
                placeholder="请选择所属系统"
                clearable
                filterable
                v-model.trim="item.System_SerialNumber"
              >
                <el-option
                  v-for="(item,index) in system_info"
                  :key="index"
                  :label="item.System_Name
              "
                  :value="item.System_SerialNumber"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-descriptions-item>
        </el-descriptions>
        <div v-if="!isUrl" class="table_titel">
          <div class="titel">
            权限标识{{form.Children.system_model_mark.length==0?'(可添加)':''}}
          </div>
          <div class="operation">
            <el-button
              type="primary"
              size="small"
              @click="add_system_model_mark"
              >新增</el-button
            >
            <el-button
              type="danger"
              size="small"
              @click="remove_system_model_mark"
              >删除</el-button
            >
          </div>
        </div>
        <el-descriptions
          :style="form.Children.system_model_mark.length-1==index?'margin-bottom: 100px;':''"
          :column="1"
          border
          size="small"
          v-for="(item,index) in form.Children.system_model_mark"
          :key="index"
        >
          <el-descriptions-item :label="index+1+'.标识名称'">
            <el-form-item
              :prop="'Children.system_model_mark.'+index+'.Mark_Name'"
              :rules="{required: true, message: '标识不能为空', trigger: 'blur' }"
            >
              <el-input
                v-model.trim="item.Mark_Name"
                placeholder="请输入标识名称"
              ></el-input>
            </el-form-item>
          </el-descriptions-item>
        </el-descriptions>
        <el-form-item class="form-operation">
          <el-button @click="window.history.back()">返回</el-button>
          <el-button
            type="primary"
            :loading="loading"
            @click="submitForm('contract')"
            >提交</el-button
          >
        </el-form-item>
      </el-form>
    </div>
    <script
      type="text/javascript"
      src="../../../utils/jquery-3.6.0.min.js"
    ></script>
    <script
      type="text/javascript"
      src="../../../utils/jquery.cookie.js"
    ></script>
    <script type="text/javascript" src="../../../utils/vue.min.js"></script>
    <script
      type="text/javascript"
      src="../../../component/elementUI/index.js"
    ></script>
    <script type="text/javascript" src="../../../utils/utils.js"></script>
    <script type="text/javascript" src="../../../utils/ID_Validity.js"></script>
    <script type="text/javascript" src="./js/Add.js"></script>
  </body>
</html>
